* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    color: #fff;
}

.wrap {
    width: 800px;
    margin: 100px auto;
    background: #999;
    padding: 0 10px;
}

.wrap p {
    border-bottom: 1px solid #555;
    height: 60px;
    line-height: 60px;
}

.wrap p span:nth-child(1) {
    width: 100px;
    display: inline-block;
}

.wrap p input {
    width: 280px;
    height: 36px;
    border: 1px solid #ccc;
    outline: none;
    border-radius: 18px;
    color: #000;
    padding-left: 20px;
    transition: width 0.5s;
}

.wrap p input:focus {
    width: 340px;
    border: 1px solid red;
}

.btn {
    text-align: center;
}

.btn button{
    padding:6px 12px;
    color:#000;
}
